<template>
  <el-form ref="infoForm"
           :model="infoForm"
           label-width="85px"
           size="small"
           :rules="rules">
    <el-row>
      <el-col :span="6">
        <el-form-item label="省:"
                      prop="province">
          <el-input v-model="infoForm.province"
                    disabled></el-input>
        </el-form-item>
      </el-col>
      <el-col :span="6">
        <el-form-item label="市:">
          <el-input v-model="infoForm.city"
                    disabled></el-input>
        </el-form-item>
      </el-col>
      <el-col :span="6">
        <el-form-item label="县:">
          <el-input v-model="infoForm.county"
                    disabled></el-input>
        </el-form-item>
      </el-col>
      <el-col :span="6">
        <el-form-item label="责任区域:">
          <el-input v-model="infoForm.territory"
                    disabled></el-input>
        </el-form-item>
      </el-col>
    </el-row>
    <el-row>
      <el-col :span="12">
        <el-form-item label="上报单位:"
                      prop="submittedName">
          <el-input v-model="infoForm.submittedName"
                    disabled></el-input>
        </el-form-item>
      </el-col>
      <el-col :span="6">
        <el-form-item label="上报编码:">
          <el-input v-model="infoForm.submittedUnit"
                    disabled></el-input>
        </el-form-item>
      </el-col>
      <el-col :span="6">
        <el-form-item label="启用:">
          <el-switch v-model="infoForm.isEnabled"
                     active-value="TRUE"
                     inactive-value="FALSE"
                     active-color="#13ce66"
                     inactive-color="#ff4949">
          </el-switch>
        </el-form-item>
      </el-col>
    </el-row>
    <el-row>
      <el-col :span="6">
        <el-form-item label="测站编码:">
          <el-input v-model="infoForm.stcd"
                    disabled></el-input>
        </el-form-item>
      </el-col>
      <el-col :span="6">
        <el-form-item label="测站名称:">
          <el-input v-model="infoForm.stnm"
                    disabled></el-input>
        </el-form-item>
      </el-col>
      <el-col :span="6">
        <el-form-item label="行政区划:">
          <el-input v-model="infoForm.addvcd"
                    disabled></el-input>
        </el-form-item>
      </el-col>

      <el-col :span="6">
        <el-form-item label="测站类型:">
          <el-input v-model="infoForm.sttp"
                    disabled></el-input>
        </el-form-item>
      </el-col>
    </el-row>
    <el-row>
      <el-col :span="6">
        <el-form-item label="建设单位:"
                      prop="constructionUnit">
          <el-select v-model="infoForm.constructionUnit"
                     filterable
                     allow-create
                     default-first-option
                     placeholder="建设单位">
            <el-option v-for="item in options.constructionUnit"
                       :key="item.value"
                       :label="item.label"
                       :value="item.value">
            </el-option>
          </el-select>
        </el-form-item>
      </el-col>
      <el-col :span="6">
        <el-form-item label="维护单位:"
                      prop="cbmu">
          <el-select v-model="infoForm.cbmu"
                     filterable
                     allow-create
                     default-first-option
                     placeholder="维护单位">
            <el-option v-for="item in options.cbmu"
                       :key="item.value"
                       :label="item.label"
                       :value="item.value">
            </el-option>
          </el-select>
        </el-form-item>
      </el-col>
      <el-col :span="6">
        <el-form-item label="经度:">
          <el-input v-model="infoForm.lgtd"
                    disabled></el-input>
        </el-form-item>
      </el-col>
      <el-col :span="6">
        <el-form-item label="纬度:">
          <el-input v-model="infoForm.lttd"
                    disabled></el-input>
        </el-form-item>
      </el-col>
    </el-row>
  </el-form>
</template>
<script>
// import Mement from 'moment'
import { mapGetters } from 'vuex'
import { updateStbprpb } from '@/api/site'
export default {
  props: {
    siteInfo: Object
  },
  data() {
    return {
      // 选项
      options: {
        cbmu: [
          {
            label: '',
            value: null
          },
          {
            label: '我司',
            value: '我司'
          },
          {
            label: '非我司',
            value: '非我司'
          }
        ],
        constructionUnit: [
          {
            label: '',
            value: null
          },
          {
            label: '我司',
            value: '我司'
          },
          {
            label: '非我司',
            value: '非我司'
          }
        ]
      },
      // 表单验证规则
      rules: {
        cbmu: [
          { required: true, message: '请输入维护单位!', trigger: 'blur' }
        ],
        constructionUnit: [
          { required: true, message: '请输入建设单位!', trigger: 'blur' }
        ]
      },
      // 表单数据
      infoForm: {}
    }
  },
  computed: {
    ...mapGetters([
      'appEnum'
    ])
  },
  mounted() {
    this.infoForm = this.siteInfo
  },
  methods: {
    updateSiteInfo() {
      this.$refs.infoForm.validate(valid => {
        if (valid) {
          updateStbprpb(this.infoForm).then(res => {
            if (res.data.success) {
              if (res.data.data) {
                this.$message({
                  type: 'success',
                  message: '修改成功!'
                })
                this.$emit('close-detail')
              }
            }
          })
        }
      })
    }
  },
  watch: {
    siteInfo() {
      this.infoForm = this.siteInfo
    }
  }
}
</script>
